import React, { useState,useContext } from 'react';
import { Button, Modal, Form, Input, Space,Switch ,message} from 'antd';
import { getTime} from '../../../../utils/publicFun'
import { addReason } from '../../../../api/OrderApi'
import myContext from '../../../../utils/myContext'

interface DataType {
    isModalOpen: boolean;
    close(): void
}

function AddModal(props: DataType) {
      const [isOpen, setIsOpen] = useState<boolean>(false);
      const context=useContext<any>(myContext)
     console.log('props', props);


    // const handleOk = () => {
    //     // setIsModalOpen(false);
    //     props.close()
    // };

    const cancleHandle = () => {
        // setIsModalOpen(false);
        props.close()
    };

    //   确认添加
    const onFinish = (values: any) => {
        // 发请求
        // 关闭添加弹框
        props.close() 

        addReason({
            // appliId:null,
            insertTime:getTime(),
            startUse:isOpen==true ? 1 :0,
            reasonDescription:values.desc
        }).then(res=>{
            console.log('添加原因res',res);
              // 提示
             message.success('添加成功') ;
            //  重新更新视图
            context.getAll()
        }).catch(err=>{
            console.log('err23232',err);        
        })
  
    };


    const onSwitchChange=(checked: boolean) => {
             setIsOpen(!isOpen)
             console.log('checked',checked);
             
      };

    

    return (
        <>
            <Modal title="添加退换货原因" open={props.isModalOpen} footer={null} forceRender>
                <Form
                    name="normal_login"
                    className="login-form"
                    onFinish={onFinish}
                >
                    <Form.Item
                       label='原因描述'
                        name="desc"
                        rules={[{ required: true, message: '请输入原因描述' }]}
                    >
                        <Input placeholder="原因描述" />
                    </Form.Item>
                    {/* <Form.Item
                     label='排序'
                        name="sort"
                        rules={[{ required: true, message: '请输入排序' }]}
                    >
                        <Input
                            placeholder="排序"
                        /> */}
                    {/* </Form.Item> */}
                    <Form.Item
                     label='是否启用'
                        rules={[{ required: true, message: 'xxx' }]}
                    >
                        <Switch checked={isOpen} onChange={onSwitchChange}></Switch>
                    </Form.Item>
                    <Form.Item shouldUpdate>
                        {() => (
                            <Space wrap>
                                <Button
                                    type="primary"
                                    htmlType="submit"
                                >
                                    确定
                                </Button>
                                <Button htmlType="button" className='orderlist_reset' onClick={cancleHandle}>
                                    取消
                                </Button>
                            </Space>

                        )}
                    </Form.Item>
                </Form>
            </Modal>
        </>
    );
};

export default AddModal;